<div class="son-show" style="padding-top:20px;display: none;">
    <form class="layui-form" action="">
        <div class="layui-form-item" style="padding-right: 30px;">
            <label class="layui-form-label">频道</label>
            <div class="layui-input-block">
            <select name="freq_id" id="freq_id">
                <option value="">选择分类</option>
                {foreach $allFreq as $v}
                <option value="{$v.id}">{$v.name}</option>
                {/foreach}
            </select>
            </div>
        </div>


        <div class="layui-form-item" style="padding-right: 30px;">
            <label class="layui-form-label">父级分类</label>
            <div class="layui-input-block">
            <select name="class_id" lay-search id="class_id">
                <option value="">选择分类</option>
                {foreach $allClass as $v}
                <option value="{$v.id}">{$v.name}</option>
                {/foreach}
            </select>
            </div>
        </div>

        <div class="layui-form-item" style="padding-right: 30px;">
            <label class="layui-form-label">子分类名</label>
            <div class="layui-input-block">
                <input type="text" id="sonName" placeholder="请输入" class="layui-input" value="" autocomplete="off">
            </div>
        </div>

        <div class="layui-form-item" style="padding-right: 30px;">
            <label class="layui-form-label">英文子分类名</label>
            <div class="layui-input-block">
                <input type="text" id="sonEnName" placeholder="请输入" class="layui-input" value="" autocomplete="off">
            </div>
        </div>

    </form>
</div>
<script>
    layui.config({
        base: '/static/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index'],function () {
        var table = layui.table;
        var form = layui.form;
        var $ = layui.$
            ,admin = layui.admin;


        //监听搜索
        form.on('submit(LAY-son-search)', function(data){
            var field = data.field;
            //执行重载
            table.reload('LAY-novel-son', {
                where: field,
                page: {
                    curr: 1  // 将页码重置为第一页
                }
            });
        });


        table.render({
            elem: '#LAY-novel-son'
            , url: '/novel/classSonList'
            , response: {
                statusCode: 1 //规定成功的状态码，本来是：0，现在统一改为1
            }
            , toolbar: '#sonToolbar' //开启头部工具栏，并为其绑定左侧模板
            , defaultToolbar: false
            , page: true //开启分页
            , limits: [15, 20, 30, 50, 100]
            , limit: 15
            , cols: [[
                {field: 'id', width: 80, title: 'ID'}
                , {field: 'name', title: '分类名称', align: 'center'}
                , {field: 'en_name', title: '英文分类名称', align: 'center'}
                , {field: 'novel_count', title: '书籍数量', align: 'center', width: 150}
                , {field: 'parent', title: '上级', templet: '#parentTpl'}
                , {title: '操作', width: 150, align: 'center', fixed: 'right', toolbar: '#table-useradmin-admin'}
            ]]
        });


        table.on('toolbar(LAY-novel-son)', function (obj) {
            switch (obj.event) {
                case 'add':
                    $("#sonName").val('');
                    $("#sonEnName").val('');
                    $("#class_id").val('');
                    $("#freq_id").val('');
                    form.render();
                    layer.open({
                        type: 1,
                        title:'添加子分类',
                        offset: '15px',
                        area: ['500px', '380px'],
                        skin: 'layui-layer-demo', //样式类名
                        closeBtn: 0, //不显示关闭按钮
                        anim: 2,
                        shadeClose: true, //开启遮罩关闭
                        content: $('.son-show'),
                        btn: ['确定', '取消']
                        ,yes: function(index, layero){
                            var name = $("#sonName").val();
                            var en_name = $("#sonEnName").val();
                            var class_id = $("#class_id").val();
                            var freq_id = $("#freq_id").val();
                            admin.req({
                                url: '/novel/setClassSon'
                                , type: "POST"
                                , data: {'name': name,'en_name':en_name, 'freq_id': freq_id,'class_id':class_id}
                                , done: function (res) {
                                    layer.msg('添加子分类成功', {icon: 1, time: 1000}, function () {
                                        layer.close(index); //关闭弹层
                                        table.reload('LAY-novel-son');
                                    });
                                },not_finish:function (res) {
                                    layer.msg(res.msg);
                                }
                            });
                        }
                    });
                    break;
            }
        });


        table.on('tool(LAY-novel-son)', function(obj) {
            var data = obj.data;
            if (obj.event === 'edit') {
                $("#sonName").val(data.name);
                $("#sonEnName").val(data.en_name);
                $("#freq_id").val(data.freq.id);
                $("#class_id").val(data.parent_class.id);
                form.render();
                layer.open({
                    type: 1,
                    title:'编辑子分类',
                    offset: '15px',
                    area: ['500px', '380px'],
                    skin: 'layui-layer-demo', //样式类名
                    closeBtn: 0, //不显示关闭按钮
                    anim: 2,
                    shadeClose: true, //开启遮罩关闭
                    content: $('.son-show'),
                    btn: ['确定', '取消']
                    ,yes: function(index, layero){
                        var name = $("#sonName").val();
                        var en_name = $("#sonEnName").val();
                        var class_id = $("#class_id").val();
                        var freq_id = $("#freq_id").val();
                        admin.req({
                            url: '/novel/setClassSon'
                            , type: "POST"
                            , data: {'name': name,'en_name':en_name, 'id': data.id, 'class_id': class_id, 'freq_id': freq_id}
                            , done: function (res) {
                                layer.msg('编辑子分类成功', {icon: 1, time: 1000}, function () {
                                    layer.close(index); //关闭弹层
                                    table.reload('LAY-novel-son');
                                });
                            },not_finish:function (res) {
                                layer.msg(res.msg,{time: 2000});
                            }
                        });
                    }
                });
            } else if (obj.event === 'del') {
                layer.confirm('所属书籍子分类将变为空，确认删除子分类？', {icon: 3, title: false}, function (index) {
                    admin.req({
                        url: '/novel/delClassSon'
                        , type: "POST"
                        , data: {'id': data.id}
                        , done: function (res) {
                            layer.msg('删除成功', {icon: 1, time: 1000}, function () {
                                obj.del();
                                layer.close(index);
                            });
                        }, not_finish: function (res) {
                            layer.msg(res.msg);
                        }
                    });
                });
            }
        });

    });
</script>